import { transform } from 'lodash'

export default {
    bind: function(el, binding) {
        let DOM = el.firstElementChild.firstElementChild
        let PARENTDOM = el.firstElementChild

        let chooice = true
        DOM.onmousedown = function($e) {
            chooice = true
            let x = 0,
                y = 0
            if (PARENTDOM.style.transform) {
                x = PARENTDOM.style.transform.split(' ')[0].replace(/translateX/g, '')
                x = parseInt(x.substring(1, x.length - 3))
                y = PARENTDOM.style.transform.split(' ')[1].replace(/translateY/g, '')
                y = parseInt(y.substring(1, y.length - 3))
            }
            DOM.onmousemove = function($ne) {
                let moveLeft = x + $ne.screenX - $e.screenX
                let moveTop = y + $ne.screenY - $e.screenY
                if (chooice) {
                    PARENTDOM.style.transform = `translateX(${moveLeft}px) translateY(${moveTop}px)`
                }
            }
        }

        DOM.onmouseup = function($e) {
            DOM.onmousemove = null
            chooice = false
        }
        DOM.onmouseleave = function($e) {
            DOM.onmousemove = null
            chooice = false
        }
    },
}